<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Script 5.3</title>
<link href="../css/global.css" rel="stylesheet" type="text/css">
<style type="text/css">
.pullquote {
	float: right;
	clear: right;
	display: block;
	width: 200px;
	border: 1px solid black;
	padding: 10px;
	font-size: 20px;
	background-color:#FFC;
	margin: 20px 0 10px 10px;
	font-style: italic;
	color: #363;
}
</style>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$("span.pq").each(function(){
		var quote=$(this).clone();
		quote.removeClass("pq");
		quote.addClass("pullquote");
		$(this).before(quote);
	
	)};

});
</script>

</head>
<body id="twoCol">
<div id="container">
  <div id="banner"><img src="../images/banner.png" alt="JavaScript: The Missing Manual" width="760" height="65"><span id="badge"><a href="http://www.sawmac.com/missing/js/"></a></span></div>
  
  <div id="contentWrap">
  <div id="main">
  <h1>Auto-Pull Quotes</h1>
  <h2>Vestibulum semper</h2>
  <p>Vestibulum semper tincidunt sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec pulvinar, justo non fringilla dapibus, sapien tortor cursus erat, at posuere magna nisi tincidunt sapien. Sed nisl. Fusce venenatis, libero porta porta fringilla, sapien odio tincidunt sem, id aliquam tellus sapien sit amet quam. Vivamus justo mi, aliquam vitae, eleifend et, lobortis quis, eros. Ut felis arcu, mollis ut, interdum molestie, vehicula a, sapien. Sed nisi nunc, bibendum vel, adipiscing sed, placerat quis, augue. Nullam ut nibh sed orci tempor rutrum. Sed iaculis. Suspendisse potenti. Donec semper molestie felis. Sed vitae diam. Curabitur sed velit convallis orci luctus viverra. Quisque et quam non tortor ultrices rutrum. Nulla porttitor mauris sed nunc. Donec lectus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras quis massa. Sed mattis erat vitae nisi.</p>
  <h2>Morbi dictum</h2>
  <p>Donec at sapien non dolor tempor congue. Morbi dictum rutrum nisl. Curabitur tellus metus, pharetra vitae, tempus sit amet, semper ac, sapien. In hac habitasse platea dictumst. Mauris est velit, placerat eu, porta eget, aliquam in, dui. Nam mi quam, lobortis in, dictum vel, gravida et, sapien. Etiam mattis. Donec sed diam nec odio molestie iaculis. Vestibulum elementum odio sed nunc. Vestibulum ac nisl a lectus posuere malesuada. Praesent lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Morbi eu nibh. In hac habitasse platea dictumst. Integer posuere tellus. Fusce et justo ac sem sagittis consectetuer. Aliquam erat volutpat. Vivamus interdum ullamcorper felis. Vestibulum pulvinar. Integer ornare malesuada diam.</p>
  <h2>Praesent sed est</h2>
  <p>Praesent sed est ac metus facilisis pharetra. <span class="pq">Maecenas risus risus, facilisis vitae, tempus id, dapibus non, nunc. Etiam pulvinar egestas pede. </span>Cras elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut quam. Vivamus at orci. In hac habitasse platea dictumst. Nunc et magna. Ut sollicitudin scelerisque mauris. Nam elementum nisl a enim.</p>
  <p>Integer lacus. Mauris condimentum scelerisque mauris. Nullam luctus. Vestibulum neque dolor, tempus quis, aliquam quis, mollis at, odio. Quisque in mi eu velit pretium commodo. Nullam fringilla mollis pede. Praesent eleifend tellus et tellus. Ut in sem. In aliquam dignissim mauris. Aenean ac magna blandit quam scelerisque accumsan. Sed suscipit odio at pede. In hac habitasse platea dictumst. Aenean sed tortor sit amet dui commodo tempus. Vestibulum sit amet arcu eu lectus scelerisque fermentum. Vivamus at arcu at est feugiat convallis. Fusce eu metus. Donec vel tellus eu massa ultrices ultricies. Cras dapibus tellus sed libero. Fusce et dolor.  </p>
</div>
  
  <div id="sidebar">
    <h2>Script 5.3</h2>
</div>
</div>
 
<div id="footer"><em>&#8220;Building Interactive Web Sites with JavaScript&#8221;</em></div>
</div>
</body>
</html>
